Gradient Line Chart

Visualizes trends with a visually appealing gradient effect. This can enhance the visual appeal of the chart and make it easier to identify patterns and trends. It is often used to highlight trends in data that has a continuous nature, such as temperature variations or stock market fluctuations.

Chart:

Code:

  const { muze, getDataFromSearchQuery } = viz;

  const data = getDataFromSearchQuery();

  const ColumnField = "Maker";
  const RowField = "Miles_per_Gallon";

  muze
    .canvas()
    .rows([RowField])
    .columns([ColumnField])
    .layers([
      {
        mark: "line",
        encoding:{
          color: ColumnField,
        }
      },
    ])
    .data(data)
    .mount("#chart") // mount your chart